<template>
  <div class="components-container">
    <!-- 弹窗  -->
    <sweet-modal ref="dialog" class="dialog">
      <h3>{{title}}</h3>
      <div style=" width:500px; margin:30px 50px">
        <div class="layui-form-item">
          <label class="layui-form-label">编号</label>
          <div class="layui-input-block">
            <el-input  v-model="creNo"  placeholder="请输入火化炉编号"></el-input>
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">类别</label>
          <div class="layui-input-block">
            <el-select v-model="creType" placeholder="请选择类别"  style="width:100%">
              <el-option v-for="item in creTypes" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </div>
        </div>
      </div>
      <div class="layui-form-item btnCenter">
        <el-button @click="closeDialog">取消</el-button>
        <el-button type="primary" :loading="this.$store.state.isloading" @click="submit">提交</el-button>
      </div>
    </sweet-modal>
    <!-- 详情  -->
    <sweet-modal ref="dialogInfo" class="dialog">
      <h3>{{title}}</h3>
      <div style=" width:500px; margin:30px 50px">
        <div class="layui-form-item">
          <label class="layui-form-label">编号</label>
          <div class="layui-input-block">
            <el-input v-model="creNo" readonly ></el-input>
          </div>
        </div>
        <div class="layui-form-item">
          <label class="layui-form-label">类别</label>
           <div class="layui-input-block">
            <el-input v-model="creType" readonly ></el-input>
          </div>
        </div>
      </div>
      <div class="layui-form-item btnCenter">
        <el-button @click="closeDialog">取消</el-button>
      </div>
    </sweet-modal>
  </div>
</template>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/common.scss";
</style>
<script>
import sweetModal from "@/components/sweetModal";
import apiBase from "@/api/apiBase.js";
const ADD = "新增";
const MODIFY = "修改";
const DELETE = "删除";
const INFO = "详情";
export default {
  name: "CremationfurnaceMain",
  data() {
    return {
      title: null,
      creTypes: [],
      title: null,
      order: null,

      creNo: null,
      creType: null,
      creStatus: null
    };
  },
  methods: {
    //功能操作
    open(order, id) {
      this.order = order;
      this.dataRepeat();
      switch (this.order) {
        case ADD:
          this.title = "火化炉新增";
          this.initSelectData();
          this.$refs.dialog.open();
          break;
        case MODIFY:
          this.title = "火化炉修改";
          this.dataInfo(id);
          this.initSelectData();
          this.$refs.dialog.open();
          break;
        case INFO:
          this.title = "火化炉详情";
          this.dataInfo(id);
          this.$refs.dialogInfo.open();
          break;
        case DELETE:
          this.dataDelete(id);
          break;
        default:
      }
    },
    //提交
    submit() {
      this.$store.state.isloading = true;
      switch (this.order) {
        case ADD:
          this.dataAdd();
          break;
        case MODIFY:
          this.dataModify();
          break;
        case DELETE:
          break;
        case INFO:
          this.$refs.dialogInfo.close();
          break;
        default:
      }
    },
    //获取类型
    getCreTypes() {
      apiBase.DoService(
        {},
        apiBase.getApiAdress().Code.GetCremationType,
        res => {
          let creTypeData = res.data.content,
            legendsCreData = creTypeData.map(item => ({
              label: item.CodeName,
              value: item.CodeValue
            }));
          this.creTypes = legendsCreData;
        }
      );
    },
    //新增
    dataAdd() {
      apiBase.DoService(
        {
          CRENO: this.creNo,
          creType: this.creType,
          CRESTATUS: this.creStatus,
          CRESERIALNUMBER: this.creSerialNumber
        },
        apiBase.getApiAdress().Cremationfurnace.Create,
        res => {
          this.$refs.dialog.close();
          this.refreshData();
          this.$message({
            message: "新增火化炉成功！",
            type: "success"
          });
        },
        res => {
          this.$message.error(res.data.msg);
        }
      );
    },
    //详情
    dataInfo(id) {
      this.creID = id;
      var data = {
        CREID: id
      };
      apiBase.DoService(
        data,
        apiBase.getApiAdress().Cremationfurnace.Detail,
        res => {
          let row = res.data.content;
          this.creID = id;
          this.creNo = row.CRENO;
          this.creType = row.CRETYPEDESC;
          this.creStatus = row.CRESTATUS;
        }
      );
    },
    //修改
    dataModify() {
      var data = {
        CREID: this.creID,
        CRENO: this.creNo,
        CRETYPE: this.creType,
        CRESTATUS: this.creStatus
      };
      apiBase.DoService(
        data,
        apiBase.getApiAdress().Cremationfurnace.Modify,
        res => {
          this.$refs.dialog.close();
          this.refreshData();
          this.$message({
            message: "修改火化炉成功！",
            type: "success"
          });
        },
        res => {
          this.$message.error(res.data.msg);
        }
      );
    },
    //删除
    dataDelete(id) {
      var data = {
        CREID: id
      };
      this.$confirm("此操作将永久删除该火化炉信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(callback => {
          apiBase.DoService(
            data,
            apiBase.getApiAdress().Cremationfurnace.Delete,
            res => {
              this.refreshData();
              this.$message({
                message: "删除火化炉成功！",
                type: "success"
              });
            }
          );
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    //数据重置
    dataRepeat() {
      this.creID = null;
      this.creNo = null;
      this.creType = null;
    },
    //初始化下拉框数据
    initSelectData() {
      this.getCreTypes();
    },
    refreshData() {
      this.$emit("refreshData");
    },
    closeDialog() {
      if (this.order === ADD || this.order === MODIFY)
        this.$refs.dialog.close();
      else if (this.order === INFO) this.$refs.dialogInfo.close();
    }
  },
  components: {
    sweetModal
  },
  mounted() {},
  created() {}
};
</script>